var ctx = wx.createCanvasContext('UnlockPops');
var brdX = 180;//大圆的x坐标
var brdy = 180;//大圆的y坐标
var bigR = 150;//大圆的半径
var bigBorderWidth=38;//大圆的边框
var moveLineWidth=20;//移动红线的宽度
var smallR = 10;//移动黄色圆点的半径
var allAngle = new Array();
var randomNumX, randomNumY;
Page({
  data: {
    num:1,
    startNum:0
  },
  onShow: function () {
    var that=this;
    var tempArray = new Array();
    var data = that.getRingAngle();
    var randomNum = Math.floor(Math.random() * 360 + 1);
        randomNumX = data[randomNum][0];
        randomNumY = data[randomNum][1];
    (function () {
      var i = that.data.startNum;
      var end = setInterval(function () {
        if (i >= 360) {
          return;
        }
        var x = parseInt(data[i][0]);
        var y = parseInt(data[i][1]);
        if (y < randomNumY){
          console.log("失败")
        }
        that.drawBackground();
        that.drawLine(x,y);
        that.smallCircle(randomNumX, randomNumY);
        that.fillText();
        i++
      }, 15);
    })()
  },// 背景大圆
  drawBackground(){
    ctx.save();
    ctx.beginPath();
    ctx.setStrokeStyle('#031634');
    ctx.setLineWidth(bigBorderWidth);
    ctx.arc(brdX, brdy, bigR - smallR, 0, 2 * Math.PI,false);
    ctx.closePath();
    ctx.stroke();
    ctx.restore();
  },//可移动的线
  drawLine(x,y){
    ctx.save();
    ctx.beginPath();
    ctx.setLineWidth(moveLineWidth);
    ctx.setStrokeStyle('#e72b5e');
    ctx.setLineCap("round");
    ctx.moveTo(x, y);
    ctx.lineTo(x, y);
    ctx.stroke();
    ctx.restore();
  },//挑战次数
  fillText(){
    var num = this.data.num;
    ctx.save();
    ctx.setFontSize(120);
    ctx.setFillStyle('#ac9ec1');
    ctx.setTextAlign('center');
    ctx.setTextBaseline("middle");
    ctx.fillText(num, brdX, brdy);
    ctx.stroke();
    ctx.restore();
  },//随机移动的黄色圆点
  smallCircle(x,y) {
    ctx.save();
    ctx.beginPath();
    ctx.setFillStyle('#edcb3d');
    ctx.arc(x, y, smallR, 0, 2 * Math.PI);
    ctx.fill();
    ctx.draw();
    ctx.restore();
  },//获取每一个红线经过圆上的坐标
  getRingAngle(){
    var centerCircle = [brdX, brdX];
    var defaultBallRadius = bigR - smallR;
    var totalAngle = 360;
    for (var i = 0; i < totalAngle; i++) {
      var temp_x = parseInt(centerCircle[0] + defaultBallRadius * Math.cos(i * Math.PI / 180));
      var temp_y = parseInt(centerCircle[1] + defaultBallRadius * Math.sin(i * Math.PI / 180));
      var location = [temp_x, temp_y];
      allAngle.push(location);
    }
    return allAngle;
  },
  touchStart(){
    this.setData({
      startNum:0
    })
    console.log(randomNumX, randomNumY)
  }
})